<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
 
<html lang="en">
<head>
<style type="text/css">
  .label {color:blue; font-style:normal; font-weight:bold}
  .tdLabel {text-align:left; vertical-align:top;  width="5%" }

</style>
	<meta charset="utf-8">
	
	<title> Login entry site </title>
    <script type="text/javascript">
  var isLoggedIn = "<%= (String)session.getAttribute("login")%>";
  if(isLoggedIn === "active")
     window.location.href="addUser";
  
</script>
    
	<link rel="stylesheet" href="css/styles.css">
	
	 <s:head />
</head>
<body>
 <div align="center">
  <br>
 <table align="center"   width="80%" border="2" cellspacing="2" cellpadding="2">
 <tr>
 <td>

  <h2 class="instructions"><span>Welcome to our study</span><br> on helping children to find content in the Internet. 
  We will be ask you to chose between two types of results found in the Internet for some question. 
  The two options will be displayed in the left and right columns under the question description. 
  If you are not sure about which one of the two options is better simply select the option "I don't know".
  <br><br>
  In order to decide which group of results is “better”, you can consider the coherence of the results given the query, or in other words based on how 
  related are the results for the query.  Also consider that we are searching information suitable and of interest for children between 7 to 12 years old. 
   <br><br>
  For example if the query is 'quail' (sort of middle size bird), it is reasonable to think that children would be looking for images, coloring pages, 
  academic/school information, quizzes and other activities involving quails.  However, results related to the electronics company Quail are most likely not 
  of interest for children and thus unsuitable for them.
  
   <br><br>
 Before starting please let us know few peaces of information about you:</h2>
 
 </td>
 </tr>
 <tr>
 <td width="100%"><h2 class="form_text"><br>Select your age: </h2> 
  
 	<s:form action="addUser" method="post" >
    <select name="user.age" key="user.age" size="1">
    
  <% for(int i =5; i<18;i++){ %>
    	<option value="<%=i%>" selected="selected"><%=i%></option>	
    <%} %>
   	 <option value="30" selected="selected">Above 18</option>	
            </select>
  <br>
  </td>
  </tr>
  <tr>
  <td width="100%"> <br>
  <h2 class="form_text"> 
   Select you gender:</h2>
   </td>
  <tr>
 <td>
 
  <s:radio theme="css_xhtml" name="user.gender" list="#{'male':'male','female':'female'}"  />
 <br>
  Check if you are, or have been, a parent of a child between 7 to 12 years old  <s:checkbox  theme="simple" name="user.parent" fieldValue="1" />
 <br><br>
 <s:submit theme="css_xhtml" value="Start survey" align="left"/>
	</s:form>
<td>
 </tr>

</table>
</div>
	<br>
  
 
<br> 
 
</body>
</html>	